import { STATUSBAND, STATUSCONFIRMTEXT } from '@/constant'
import { Popconfirm, Space, TableColumnsType, Tag, Tooltip, Typography, Image, Badge } from 'antd'
import { NavigateFunction } from 'react-router-dom'
import type { ITableData } from './types'
export const useIndexColumns = ({ navigate }: { navigate: NavigateFunction }): TableColumnsType<ITableData> => [
  {
    title: '面料编码',
    dataIndex: 'fabricCode',
    key: 'fabricCode',
    align: 'center',
    width: 150,
    fixed: 'left',
    render: (info, rows) => {
      return (
        <Typography.Link
          ellipsis
          onClick={() => {
            navigate('/goods/fabric/detail?fabricId=' + rows.fabricId)
          }}
          style={{ paddingLeft: 12, paddingRight: 12 }}
        >
          {info}
        </Typography.Link>
      )
    },
  },

  {
    title: '面料名称',
    dataIndex: 'fabricName',
    key: 'fabricName',
    align: 'center',
    width: 150,
    fixed: 'left',
    ellipsis: {
      showTitle: false,
    },
    render: (info) => {
      return (
        <Tooltip placement="top" title={info}>
          {info || '-'}
        </Tooltip>
      )
    },
  },
  {
    title: '开发季',
    dataIndex: 'devSeason',
    key: 'devSeason',
    align: 'center',
    width: 150,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '可用大类',
    dataIndex: 'classNames',
    key: 'classNames',
    align: 'center',
    width: 150,
    ellipsis: {
      showTitle: false,
    },
    render: (info) => {
      return (
        <Tooltip placement="top" title={info}>
          {info || '-'}
        </Tooltip>
      )
    },
  },
  {
    title: '关联面种编码',
    dataIndex: 'fabricTypeCode',
    key: 'fabricTypeCode',
    align: 'center',
    width: 150,
    render: (info, rows) => {
      return info ? (
        <Tooltip
          placement="top"
          overlayInnerStyle={{ width: 'max-content' }}
          title={
            <div style={{ maxWidth: 300 }}>
              <div style={{ padding: 3 }}>幅宽（cm）：{rows?.productFabricTypeVO?.fabricBreadth || '-'}</div>
              <div style={{ padding: 3 }}>克重（g/㎡）：{rows?.productFabricTypeVO?.gramWeight || '-'}</div>
              <div style={{ padding: 3 }}>纱支规格：{rows?.productFabricTypeVO?.yarnSpec || '-'}</div>
              <div style={{ padding: 3 }}>成分：{rows?.productFabricTypeVO?.fabricComposition || '-'}</div>
            </div>
          }
        >
          <Typography.Link
            ellipsis
            onClick={() => {
              navigate('/goods/config/list?type=fabricType&keyword=' + info)
            }}
            style={{ paddingLeft: 12, paddingRight: 12 }}
          >
            {info}
          </Typography.Link>
        </Tooltip>
      ) : (
        '-'
      )
    },
  },
  {
    title: '面料季节',
    dataIndex: 'seasonClassify',
    key: 'seasonClassify',
    align: 'center',
    width: 150,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '面料定位',
    dataIndex: 'devLocation',
    key: 'devLocation',
    align: 'center',
    width: 150,
    render: (info) => {
      return info || '-'
    },
  },
  {
    title: '是否集约',
    dataIndex: 'intensiveStatus',
    key: 'intensiveStatus',
    align: 'center',
    width: 150,
    render: (info) => {
      return STATUSCONFIRMTEXT[info] || '-'
    },
  },
  {
    title: '面料备注',
    dataIndex: 'remark',
    key: 'remark',
    align: 'center',
    width: 150,
    ellipsis: {
      showTitle: false,
    },
    render: (info) => {
      return (
        <Tooltip placement="top" title={info}>
          {info || '-'}
        </Tooltip>
      )
    },
  },
  {
    title: '状态',
    dataIndex: 'enableStatus',
    key: 'enableStatus',
    align: 'center',
    width: 150,
    render: (info) => {
      return <Badge status={info == 1 ? 'success' : 'error'} text={STATUSBAND[info] || '-'} />
    },
  },
]
